
<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <meta charset="utf-8">
    <style>
        body {
            margin: 0px;
            background-color: #000000;
            overflow: hidden;
        }
    </style>
</head>
<body>

<script src="js/three.js"></script>
<script src="js/TrackballControls.js"></script>
<script src="js/Detector.js"></script>

<script>

    var camera, scene, renderer,textureCube;
    var mesh;

    init();
    animate();

    function init() {
        if ( ! Detector.webgl ) Detector.addGetWebGLMessage();

        renderer = new THREE.WebGLRenderer();
        renderer.setSize( window.innerWidth, window.innerHeight );
        document.body.appendChild( renderer.domElement );
        //
        camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 1000 );
        camera.position.z = 900;
        scene = new THREE.Scene();


		var geometry = new THREE.CubeGeometry(400,400,400,1,1,1);
        // 纹理坐标怎么弄

        function createCubeMap() {
            var path = "images/textures/";//nature 可以修改为不同文件夹下的纹理
            var format = '.png';
            var urls = [
                path + 'pos-x' + format, path + 'neg-x' + format,
                path + 'pos-y' + format, path + 'neg-y' + format,
                path + 'pos-z' + format, path + 'neg-z' + format
            ];
            var textureCube = THREE.ImageUtils.loadTextureCube(urls, new THREE.CubeReflectionMapping());
            return textureCube;
        }
        textureCube=createCubeMap();
        var cubeMaterials = new THREE.MeshBasicMaterial({
            color: 0xcccccc,
            envMap: textureCube
        });

//        var cubeMaterialss=new THREE.MeshBasicMaterial({map:textureCube});
        
        mesh = new THREE.Mesh( geometry,cubeMaterials);
        scene.add( mesh );

        //
        window.addEventListener( 'resize', onWindowResize, false );

    }

    function onWindowResize() {
        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();
        renderer.setSize( window.innerWidth, window.innerHeight );
    }

    function animate() {
		mesh.rotation.y -= 0.004;
		mesh.rotation.x -= 0.005;
        mesh.rotation.z += 0.004;
        requestAnimationFrame( animate );
        renderer.render( scene, camera );
    }

</script>

</body>
</html>
